import React, { useEffect, useState } from 'react'
import { Radio, Space, Button } from 'antd-mobile'
import './Home.css'
import { getApi } from '../../api/index'
import { useNavigate } from 'react-router-dom'
function Home() {
    const navigate = useNavigate()
    const [value, setValue] = useState('')
    useEffect(() => {
        getApi().then(res => {
            console.log(res);
            setValue(res.data.city)

        })
    }, [])
    const click = () => {
        navigate('/trainlist')
     }
     const tocity = () => {
        navigate('/citylist')
     }
     

    return (
        <div>
            <div className='home-box'>
                <div className='home-box-top'>
                    <div onClick={tocity}>{value}</div>
                    <div>南京南站</div>
                </div>
                <div className='home-box-center'>
                    <div>
                        <span>11月29日</span>
                        <span>明天出发</span>
                    </div>
                </div>
                <div className='home-box-bottom'>
                    <Radio
                        value='small'
                        style={{
                            '--icon-size': '18px',
                            '--font-size': '14px',
                            '--gap': '6px',
                        }}
                    >
                        高铁动车
                    </Radio>
                    <Radio
                        value='small'
                        style={{
                            '--icon-size': '18px',
                            '--font-size': '14px',
                            '--gap': '6px',
                        }}
                    >
                        学生票
                    </Radio>
                </div>
                <div className='home-box-button' onClick={click}>
                    <Button block color='primary' size='large'>
                        火车票查询
                    </Button>
                </div>
            </div>
        </div>
    )
}

export default Home
